<template>
  <a-table :columns="columns" :data-source="page.list" rowKey='ca_id' :pagination="pagination" @change="handleTableChange" bordered>
    <template #action="{ record }">
      <a-button @click="openUpd(record)">修改</a-button>
    </template>
  </a-table>
  <adjust-upd ref="UpdRef" @flash="getPage(page.current)"></adjust-upd>
</template>
<script setup>
import { ref, reactive } from "vue";
import { get, put } from "@/common";
import AdjustUpd from "./adjustUpd.vue";
const UpdRef=ref();
const openUpd=(record)=>{
  UpdRef.value.openUpd(record);
};
const columns = [
  {
    title: '商品id',
    dataIndex: 'ca_id',
    key: 'ca_id',
  },
  {
    title: '商品名称',
    key: 'ca_name',
    dataIndex: 'ca_name',
  },
  {
    title: '商品类型',
    dataIndex: 'ty_name',
    key: 'ty_name',
  },
  {
    title: '商品保质期',
    dataIndex: 'ca_date',
    key: 'ca_date',
  },
  {
    title: '商品价格',
    dataIndex: 'ca_price',
    key: 'ca_price',
  },
  {
    title: '单位',
    key: 'im_unit',
    dataIndex: 'im_unit',
  },
  {
    title: '操作',
    key: 'action',
    slots: { customRender: 'action' },
  },
];

const query = reactive({});

const page = ref({}); //接收服务端返回的分页对象

const pagination = reactive({
  current: 1, //当前页
  pageSize: 2, //每页记录数
  total: 0, //总记录数
  pageSizeOptions: ["2", "3", "5", "10", "20", "30", "100"], //每页记录下拉框的选型
  showSizeChanger: true, //是否展示每页记录数下拉框
  showQuickJumper: true, //是否展示快速跳转
  showTotal: (total, range) => {
    //展示总页数等文字说明信息的
    return (
      "共" +
      total +
      "条记录,当前第" +
      pagination.current +
      "页" +
      (range[1] - range[0] + 1) +
      "条记录"
    );
  },
});

//获取当前分页
const getPage = (pageNum = 1) => {
  query.pageNum = pageNum;
  query.pageSize = pagination.pageSize;

  get("/cargo/manage/page", query).then((res) => {
    page.value = res.data; //将服务端传来的分页数据赋值予page
    console.log('page.value : ' + JSON.stringify(page.value))

    //更新分页引擎
    pagination.current = page.value.current;
    pagination.pageSize = page.value.pageSize;
    pagination.total = page.value.total;
  });
};
getPage(1); //页面加载是，首先加载第一页

//当分页发送变化时（如：页码、每页记录数变化时）
const handleTableChange = (pagi, filters, sorter, { currentDataSource }) => {
  pagination.current = pagi.current;
  pagination.pageSize = pagi.pageSize;
  pagination.total = pagi.total;

  getPage(pagination.current);
};

</script>